<template>
  <div class="login">
    <div class="main">
      <span>欢迎进入小王的博客平台</span>
      <el-input
        placeholder="请输入内容"
        v-model="username"
        clearable
        style="width: 80%; marginTop:10px"
      >
      </el-input>
      <el-input
        placeholder="请输入密码"
        v-model="password"
        show-password
        style="width: 80%; marginTop:10px"
      ></el-input>
      <el-button type="primary" style="width:90px; marginTop:30px" @click="login">登陆</el-button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: "admin",
      password: "admin",
    };
  },
  name: "login",
  components: {},
  created(){
      console.log(this.$route);
      console.log(this.$router);
  },
  methods:{
      login(){
          const a =true
         if(a){
             this.$router.push({name:'home'})
         }
      }
  }
};
</script>

<style lang='scss' scoped>
.login {
  width: 100vw;
  height: 100vh;
  background: url(../../assets/img/bc.jpg) 0 0/100% 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  .main {
    width: 400px;
    height: 270px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 5%;
    box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.01);
    text-align: center;
    span {
      font-size: 24px;
      color: #fff;
      font-weight: 500;
      line-height: 70px;
    }
  }
}
</style>